Introducción a la arquitectura Model View Controller (MVC)

Frameworks

Los frameworks ofrecen un conjunto de clases, concretas y abstractas, así como interfaces que ayudan a la resolución de problemas frecuentes y que, además guían al desarrollador en el diseño arquitectónico del sistema.

Los frameworks se componen de un conjunto interrelacionado de clases fácilmente extensibles.

Características de los frameworks

1. Disponen de un conjunto cohesivo de interfaces y clases que colaboran para proporcionar los servicios de la parte central e invariable de un subsistema lógico.

2. Contienen clases concretas y abstractas que definen las interfaces a las que ajustarse, interacciones de objetos en las que participar, y otras invariantes.

3. Normalmente, requieren que el usuario del framework defina subclases de las clases que se incluyen en él para utilizar, adaptar y extender los servicios del framework. Estas subclases recibirán mensajes desde las clases predefinidas del framework que, normalmente, se manejan implementando métodos abstractos heredados de las clases abstractas del framework y que el usuario habrá tenido que redefinir.

Es posible usar un framework para crear una aplicación completa o implementar parte de una aplicación, como la interfaz de usuario gráfica.

Clases de Frameworks

1. Frameworks de infraestructura de sistema: Dichos frameworks apoyan el desarrollo de infraestructuras de sistema como comunicaciones, interfaces de usuario y compiladores.

2. Frameworks de integración de middleware: Consisten en un conjunto de estándares y clases de objetos asociados que soportan comunicación de componentes e intercambio de información. Los ejemplos de este tipo de framework incluyen .NET de Microsoft y Enterprise Java Beans (EJB). Dichos frameworks brindan soporte para modelos estandarizados de componentes.

3. Frameworks de aplicación empresarial: Se ocupan de dominios de aplicación específicos, tales como los sistemas de telecomunicaciones. El conocimiento del dominio de la aplicación integra y apoya el desarrollo de aplicaciones de usuario final.

Patrón Model View Controller (MVC)

Modelo Vista Controlador es un patrón de diseño arquitectónico que divide la aplicación en tres componentes:

• El Modelo: contiene la lógica de negocio, es decir, las clases que implementan los métodos propios de la aplicación. Comunica sus cambios a la vista.

  EL OBSERVADOR (VISTA) cambia el sujeto (modelo) por el controlador, puede pedirle registrar servicios y ofrece métodos para ser actualizado, en este caso invocados por el modelo.

   

• La Vista: representa lo que el usuario ve de la aplicación, es decir, las ventanas de la interfaz gráfica. También, a través de ellas, el usuario interactúa con la aplicación.

  EL CONTROLADOR intermedia entre el modelo y las vistas, invocando los serivicios del modelo solicitados por estas y registrando las vistas al modelo.

   

• El Controlador: reacciona a las acciones del usuario, ejecutando los métodos necesarios del modelo.

  EL MODELO atiende los servicios pedidos por el controlador. Tiene una colección de vistas (observadores) a las que notifica los cambios cuando es oportuno (ej. si hay algún cambio).

Se usa típicamente en la Programación Orientada a Objetos para diseñar las interfaces gráficas.

Estructura

Implementación

PASO 1: CREACIÓN DE LAS INTERFACES

xxxxxxxxxx
5
1
public interface Observador {
2
    
3
    public void actualizarResultado(double dato);
4
    public void actualizarError(String mensaje);
5
}

xxxxxxxxxx
7
1
public interface Sujeto {
2
    
3
    public void registrarObservador(Observador o);
4
    public void borrarObservador(Observador o);
5
    public void notificarResultado();
6
    public void notificarError(); 
7
}

PASO 2: CREACIÓN DEL CONTROLADOR

xxxxxxxxxx
46
1
public class Controlador {
2

3
    private Model model; // EL CONTROLADOR MANTIENE UNA REFERENCIA AL MODELO
4

5
    // QUE LE ASIGNA EL CLIENTE AL CONSTUIRLO
6
    public Controlador(Model m) {
7
        this.model = m;
8
    }
9

10
    // SE ENCARGA DE ATENDER LAS PETICIONES DE LOS OBSERVADORES
11
    public void ejecutarOperacion(String op1, String op2, String signo) {
12
        
13
        try {
14
            int v1 = Integer.parseInt(op1);
15
            int v2 = Integer.parseInt(op2);
16

17
            this.model.setX(v1);
18
            this.model.setY(v2);
19

20
            if (signo.equalsIgnoreCase("+"))
21
                this.model.suma();
22
            else if (signo.equalsIgnoreCase("-"))
23
                this.model.resta();
24
            else if (signo.equalsIgnoreCase("*"))
25
                this.model.multiplicacion();
26
            else if (signo.equalsIgnoreCase("/"))
27
                this.model.division();
28
            else
29
                throw new NumberFormatException();
30
            
31
        } catch (NumberFormatException e) {
32
            
33
            // AVISA DE ERROR SI SE PRODUCEN EN LA ENTRADA
34
            JOptionPane.showMessageDialog(null, "Operando(s) incorrcto(s)");
35
        }
36
    }
37

38
    // MÉTODOS PARA EL REGISTRO/BORRADO DE OBSERVADORES
39
    public void registrarObservador(Observador o) {
40
        this.model.registrarObservador(o);
41
    }
42

43
    public void borrarObservador(Observador o) {
44
        this.model.borrarObservador(o);
45
    }
46
}

PASO 3: CREACIÓN DEL MODELO (SUJETO CONCRETO)

xxxxxxxxxx
67
1
public class Model implements Sujeto {
2
    
3
    private double x, y;
4
    private double resultado;
5
    private List<Observador> observadores;
6

7
    // CONSTRUCTOR
8
    public Model() {
9
        // CREACION DE LA COLECCION DE OBSERVADORES
10
        this.observadores = new ArrayList<Observador>();
11
    }
12

13
    // SETTERS PARA x E y YA QUE resultado SE ASIGNA EN LOS METODOS DE LAS OPERACIONES.
14
    public void setX(int v) {
15
        this.x = v;
16
    }
17

18
    public void setY(int v) {
19
        this.y = v;
20
    }
21

22
    // METODOS PROPIOS DE LA APLICACION:
23
    // OPERACIONES Y CAMBIO EN LA INFORMACION DE ESTADO DEL RESULTADO
24
    public void suma() {
25
        this.resultado = this.x + this.y;
26
        notificarResultado();
27
    }
28

29
    public void resta() {
30
        this.resultado = this.x - this.y;
31
        notificarResultado();
32
    }
33

34
    public void multiplicacion() {
35
        this.resultado = this.x * this.y;
36
        notificarResultado();
37
    }
38

39
    public void division() {
40
        if (this.y == 0)
41
            notificarError();
42
        else {
43
            this.resultado = this.x / this.y;
44
            notificarResultado();
45
        }
46
    }
47

48
    // METODOS PARA NOTIFICAR A LOS OBSERVADORES
49
    public void notificarResultado() {
50
        for (Observador o : observadores)
51
            o.actualizarResultado(this.resultado);
52
    }
53

54
    public void notificarError() {
55
        for (Observador o : observadores)
56
            o.actualizarError("ERROR: Division by zero");
57
    }
58

59
    // METODOS PARA LA GESTION DE LA LISTA DE OBSERVADORES
60
    public void registrarObservador(Observador o) {
61
        observadores.add(o);
62
    }
63

64
    public void borrarObservador(Observador o) {
65
        observadores.remove(o);
66
    }
67
}

PASO 4: CREACIÓN DE LAS VISTAS (OBSERVADORES CONCRETOS)

xxxxxxxxxx
25
1
// VISTA TIPO OBSERVADOR "CLASICO" 
2

3
// PASIVAMENTE RECIBE LA NOTIFICACIÓN DEL RESULTADO CUANDO SE PRODUCE
4
// LO MISMO CON LA INDICACIÓN DE ERROR DE DIVISIÓN POR CERO 
5

6
public class VistaConsola implements Observador {
7
    private Controlador controlador;
8

9
    // EN EL CONSTRUCTOR, SE ASIGNA SU CONTROLADOR (ESTO CAMBIA YA QUE NO HAY
10
    // REFERENCIA DIRECTA AL MODELO) Y SE LE PIDE AL CONTROLADOR QUE REGISTRE LA VISTA
11
    public VistaConsola(Controlador controlador) {
12
        this.controlador = controlador;
13
        this.controlador.registrarObservador(this);
14
    }
15

16
    // LA VISTA MUESTRA EL ERROR Y LOS RESULTADOS COMO CONSIDERE
17
    public void actualizarResultado(double dato) {
18
        System.out.println("Resultado: " + dato);
19
    }
20

21
    public void actualizarError(String message) {
22
        System.err.println(message);
23
        System.err.flush();
24
    }
25
}

xxxxxxxxxx
91
1
/*ESTA VISTA YA ES MAS PROPIA DE MODELO VISTA - CONTROLADOR
2
  TIENE LA RESPONSABILIDAD DE INTERACTUAR CON EL USUARIO DE FORMA GRAFICA
3
  ACEPTANDO ENTRADAS ADEMAS DE MOSTRANDO SALIDAS.
4
   - PEDIR DATOS DE ENTRADA
5
   - PEDIR OPERACION
6
   - MOSTRAR RESULTADOS O INDICACION DE ERROR */
7

8
public class VistaVentana extends JFrame implements Observador, ActionListener {
9

10
    // JAVA PARA CREAR LA VENTANA
11
    private static final long serialVersionUID = 1L;
12
    private JTextField oper1;
13
    private JTextField oper2;
14
    private JButton suma, resta, producto, division;
15
    private JTextField resultado;
16

17
    private Controlador controlador; // LA VISTA MANTIENE UNA REFERENCIA AL CONTROLADOR
18

19
    public VistaVentana(Controlador controlador) {
20

21
        // SE GESTIONA MOSTRAR LA VENTANA
22
        super("Calculadora");
23
        initGUI();
24

25
        // LA PARTE DE REGISTRO ES IGUAL QUE EN OTRAS VISTAS, MEDIANTE EL CONTROLADOR AL
26
        // QUE SE LE PIDE QUE LA REGISTRE
27
        
28
        // GUARDAR LA REFERENCIA AL CONTROLADOR
29
        this.controlador = controlador;
30
        // LA VISTA SOLICITA SU REGISTRO AL CONTROLADOR
31
        this.controlador.registrarObservador(this);
32
    }
33

34
    // JAVA PARA LA GESTIÓN DE LA VENTANA
35
    private void initGUI() {
36
        this.setLayout(null);
37

38
        // CREACIÓN DE LOS ELEMENTOS GRAFICOS
39
        oper1 = new JTextField(20);
40
        oper1.setBounds(10, 10, 100, 30);
41
        oper2 = new JTextField(20);
42
        oper2.setBounds(110, 10, 100, 30);
43
        suma = new JButton("+");
44
        suma.setBounds(10, 50, 100, 30);
45
        resta = new JButton("-");
46
        resta.setBounds(110, 50, 100, 30);
47
        producto = new JButton("*");
48
        producto.setBounds(210, 50, 100, 30);
49
        division = new JButton("/");
50
        division.setBounds(310, 50, 100, 30);
51
        resultado = new JTextField(20);
52
        resultado.setBounds(10, 85, 400, 30);
53

54
        // LA PROPIA CLASE ES LA QUE GESTIONA LOS EVENTOS SOBRE LOS BOTONES DE LOS OPERADORS
55
        suma.addActionListener(this);
56
        resta.addActionListener(this);
57
        producto.addActionListener(this);
58
        division.addActionListener(this);
59
        this.add(oper1);
60
        this.add(oper2);
61
        this.add(suma);
62
        this.add(resta);
63
        this.add(producto);
64
        this.add(division);
65
        this.add(resultado);
66
        this.setDefaultCloseOperation(DISPOSE_ON_CLOSE);
67
        this.setSize(430, 150);
68
        setLocationRelativeTo(null);
69
        this.setVisible(true);
70
    }
71

72
    // ESTE ES EL METODO DEL ActionListener QUE GOBIERNA QUE HACER AL PULSAR LOS BOTONES
73
    public void actionPerformed(ActionEvent e) {
74
        String oper1 = this.oper1.getText();
75
        String oper2 = this.oper2.getText();
76
        String signo = e.getActionCommand();  // CUANDO EL USUARIO PULSA UN OPERADOR LA VISTA INVOCA EL METODO DEL CONTROLADOR     
77

78
        controlador.ejecutarOperacion(oper1, oper2, signo);
79
    }
80

81
    // MÉTODOS DE ACTUALIZACION INVOCADOS POR EL MODELO PARA
82
    // QUE LA VISTA MUESTRE LOS RESULTADOS Y ERRORES COMO CONSIDERE
83
    public void actualizarResultado(double dato) {
84
        String str = Double.toString(dato);
85
        this.resultado.setText(str);
86
    }
87

88
    public void actualizarError(String mensaje) {
89
        this.resultado.setText(mensaje);
90
    }
91
}

PASO 5: CREACIÓN DEL MAIN

xxxxxxxxxx
16
1
public class Main {
2

3
    public static void main(String[] args) {
4

5
        Model modelo = new Model(); // SE CREA EL MODELO
6
        Controlador controlador = new Controlador(modelo); // SE CREA EL CONTROLADOR
7

8
        SwingUtilities.invokeLater(new Runnable() {
9
            public void run() {
10
                new VistaVentana(controlador); // SE CREA LA VISTA
11
            }
12
        });
13
        
14
        new VistaConsola(controlador); // SEGUNDA VISTA
15
    }
16
}